<template>
    <div >
        <div style="margin-left:0.2rem;font-size: 14px">
            <!-- <div v-if="data >=1000000 && data < 10000000">
                {{ String(data).slice(0,3)}}万
            </div>
            <div v-else-if="data >=100000 && data < 1000000">
                {{ String(data).slice(0,2)}}万
            </div>
            <div v-else-if="data >=10000 && data < 100000">
                {{ String(data).slice(0,1)}}万
            </div> -->
            <div v-if="data ==0 || data ==null || data ==''" style="color: silver;">
                -
            </div>
            <div v-else>{{ parseInt(data) }}</div>
        </div>
        <div v-if="rate == null || rate == '' || rate == undefined"></div>
        <div v-else>
            <div style="display: flex;margin-left:30%;width: 100%;" v-if="rate >0">
<!--                <img style="width: 0.7rem;" src="../assets/img/icon/arrowup1.svg"/> -->
<!--                <div style="min-width:2.5rem;color:#F53F3F">{{ rate.toFixed(1) }}%</div>-->
            </div>
            <div style="display: flex;margin-left:0.65rem;color: silver;" v-else-if="rate == 0 || rate == '' || rate == null">
<!--                <div style="text-align: center;width: 100%;">0.0%</div>-->
            </div>
            <div style="display: flex;margin-left:30%;" v-else-if="rate <0">
<!--                <img style="width: 0.7rem;transform:rotate(180deg);" src="../assets/img/icon/arrowdown.svg"/> -->
<!--                <div style="min-width:2.5rem;color:#58A55C">{{Math.abs(rate).toFixed(1)}}%</div>-->
            </div>
        </div>
    </div>
</template>
<script>

export default {
props:{
    data: {
      type: Number,
      required: true
    },
    rate: {
      type: Number,
      required: true
    }
}
}
</script>

<style lang="scss" scoped>

</style>